<!--
  Generated template for the FabPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <ion-title>fab</ion-title>
  </ion-navbar>

</ion-header>


<ion-content padding>
    <p>基本FAB</p>
    <ion-fab top right edge>
      <button ion-fab mini>
        <ion-icon name="add"></ion-icon>
      </button>
      <ion-fab-list>
        <button ion-fab>
          <ion-icon name="logo-googleplus" color="danger"></ion-icon>
        </button>
        <button ion-fab>
          <ion-icon name="logo-twitter" color="primary"></ion-icon>
        </button>
        <button ion-fab>
          <ion-icon name="logo-facebook" color="secondary"></ion-icon>
        </button>
      </ion-fab-list>
    </ion-fab>
  <p>居中 FAB</p>
  <ion-fab center middle>
    <button ion-fab>
      <ion-icon name="share"></ion-icon>
    </button>
    <ion-fab-list side="top">
      <button ion-fab>
        <ion-icon name="logo-googleplus"></ion-icon>
      </button>
    </ion-fab-list>
    <ion-fab-list side="left">
      <button ion-fab>
        <ion-icon name="logo-twitter"></ion-icon>
      </button>
    </ion-fab-list>
    <ion-fab-list side="right">
      <button ion-fab>
        <ion-icon name="logo-apple"></ion-icon>
      </button>
    </ion-fab-list>
    <ion-fab-list side="bottom">
      <button ion-fab>
        <ion-icon name="logo-facebook">
        </ion-icon>
      </button>
    </ion-fab-list>
  </ion-fab>
</ion-content>
